<template>
	<view class="content">
		<view class="bdbg">
			<u-form :model="form" ref="uForm" :label-width="166">
				<u-form-item label="仓库名称" prop="name" required>
					<u-input v-model="form.name" placeholder="请输入仓库名称" />
				</u-form-item>

				<u-form-item label="仓库地址" prop="address">
					<u-input v-model="form.address" placeholder="请输入仓库地址" />
				</u-form-item>
				<u-form-item label="负责人" prop="manager_name">
					<u-input v-model="form.manager_name" placeholder="请输入负责人姓名" />
				</u-form-item>
				<u-form-item label="联系电话" prop="phone">
					<u-input v-model="form.phone" placeholder="请输入联系电话" />
				</u-form-item>
				<u-form-item label="状态" prop="status">
					<u-switch v-model="form.status" active-value="1" inactive-value="0"></u-switch>
					<text class="ml20">{{form.status === '1' ? '启用' : '禁用'}}</text>
				</u-form-item>
				<u-form-item label="备注" prop="remark">
					<u-input v-model="form.remark" type="textarea" placeholder="请输入备注信息" />
				</u-form-item>
			</u-form>
		</view>
		<view class="btnBox">
			<u-button type="primary" @click="submitForm">提交</u-button>
			<u-button @click="resetForm">重置</u-button>
		</view>
	</view>
</template>

<script>
	let that = '';
	import { apiStockStore } from '@/api/crm.js'
	export default {
		data() {
			return {
				form: {
					name: '',
					address: '',
					manager_name: '',
					phone: '',
					status: '1',
					remark: ''
				},
				rules: {
					name: [{
						required: true,
						message: '请输入仓库名称',
						trigger: ['blur', 'change']
					}]
				}
			}
		},
		onLoad(options) {
			that = this;
			if (options.type === 'update') {
				// 编辑模式
				uni.setNavigationBarTitle({
					title: '编辑仓库'
				})
				this.getDetailData()
			} else {
				// 新增模式
				uni.setNavigationBarTitle({
					title: '新增仓库'
				})
			}
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		methods: {
			// 获取详情数据
			getDetailData() {
				if (!uni.$stockStoreInfo) {
					uni.showToast({
						title: '数据加载失败',
						icon: 'none'
					})
					return
				}
				that.form = Object.assign({}, uni.$stockStoreInfo)
			},
			// 提交表单
			submitForm() {
				this.$refs.uForm.validate(valid => {
					if (valid) {
						uni.showLoading({
							title: '提交中...',
							mask: true
						})
						
						let action = uni.$stockStoreInfo ? 'update' : 'add'
						let reqData = {
							action: action,
							params: {
								req: that.form
							}
						}
						
						apiStockStore(reqData)
							.then(res => {
								uni.showToast({
									title: '操作成功',
									duration: 1500
								})
								setTimeout(() => {
									uni.navigateBack()
								}, 1500)
							})
					} else {
						uni.showToast({
							title: '请检查表单',
							icon: 'none'
						})
					}
				})
			},
			// 重置表单
			resetForm() {
				this.form = {
					name: '',
					address: '',
					manager_name: '',
					phone: '',
					status: '1',
					remark: ''
				}
			}
		}
	}
</script>

<style>
	.content {
		padding: 20rpx;
	}
	
	.bdbg {
		background-color: #FFFFFF;
		border-radius: 10rpx;
		padding: 30rpx;
		margin-bottom: 30rpx;
	}
	
	.btnBox {
		display: flex;
		justify-content: space-between;
		padding: 0 30rpx;
	}
	
	.btnBox .u-button {
		width: 48%;
	}
</style>